<template>
  <div class="page-main" >
    
    <div class=" containerMore" style="padding-top: 0px;">
    
      <div class="container-bg" style="    padding: 0;">
       
       

      <div class=" " >          
      
        <div class="box-right" style="padding:0 16px;width: 100%;">
          
           <div class="header" style="padding: 8px 0;">
          <a-row type="flex" justify="space-between" align="middle">
            <a-col>
              <a-button class="hte-btn" @click="searchReset">刷新</a-button>
              <span v-if="customParam.batchQueryType=='2' && isEdit">
                <a-button class="hte-btn" type="danger" @click="handAction('del')" >删除</a-button>
                <span style="color:red">如数据需要调整，则删除，重新导入即可。</span>
              </span>  
            </a-col>
            <a-col class="input-ground">
              <a-input-group compact>
                <a-select v-model="searchField" @change="changeKeywordType" style="min-width:160px">
                  <a-select-option value="t.std_no">感官标准样编号</a-select-option>
                  <a-select-option value="t.mara_matnr">物料编号</a-select-option>
                  <a-select-option value="mara.maktx">物料名称</a-select-option>
                  <a-select-option value="applyMatnr">适用物料编号</a-select-option>
                  <a-select-option value="applyMaktx">适用物料名称</a-select-option>
                </a-select>
                <a-input-search
                  v-model="queryParam.keyword"
                  @search="doSearch"
                  allowClear
                  placeholder="请输入关键词检索"
                />
               
              </a-input-group>
              <a-button class="hte-btn del-btn" @click="visibleModel = true">高级查询</a-button>
            </a-col>
          </a-row>
        </div>
          <a-table
            class="hte-table-content"
            :scroll="{ x: 1720 }"
            :columns="columns"
            :data-source="dataSource"
            :pagination="ipagination"
            :loading="loading"
            rowKey="rowKey"
            size="middle"
            @change="handleTableChange"
            :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange,getCheckboxProps:getCheckboxProps}"
          >            
          <template slot="filterStatus" slot-scope="text, record,index">       
              <span>{{text|stdSampleStatusFilter}}</span>
                
            </template>
              <template slot="link" slot-scope="text, record,index">       
              <span class="clickspan" @click="handAction('link', record)">{{ text }}</span>
            </template>
           
            <template slot="filterStatus" slot-scope="text, record,index">       
              <span>{{text|stdSampleStatusFilter}}</span>
                
            </template>
           <span slot="action" slot-scope="text, record">
              <a @click="handAction('link',record)">详情</a>
              <a-divider type="vertical" />
              <a @click="handAction('his',record)">历史版本</a>
            </span>
             <template slot="target" slot-scope="text, record">
              <span :class="{'targetRed': !!text&& text.indexOf('A')<0}">{{ text }}</span>
            </template>
            <template slot="pushTime" slot-scope="text, record">
              <span >{{ record.pushTime }}</span>
            </template>
            <template slot="submitTime" slot-scope="text, record">
              <span >{{ record.submitTime }}</span>
            </template>
            <template slot="executeTime" slot-scope="text, record">
              <span >{{ record.executeTime }}</span>
            </template>
            <template slot="autoAbolishTime" slot-scope="text, record">
               <span >{{ record.autoAbolishTime }}</span>
            </template>
              <template slot="abolishTime" slot-scope="text, record">
               <span >{{ record.abolishTime }}</span>
            </template>
            <template slot="textOver" slot-scope="text">
              <span class="text-over" :title="text">{{text}}</span>
            </template>
          </a-table>
        </div>
         </div>
      </div>
    </div>
    
    <!-- 高级查询 -->
    <advanced-search
      :dataForm.sync="queryParam"
      :visible="visibleModel"
      ref="advanced"
      :formCol="queryParamCol"
      @ok="callBackResult"
      @reset="resetResulte"
      @close="closeResulte"
    >
    </advanced-search>
    
  </div>
</template>
<script>
import Vue from 'vue'
import { getAction, deleteAction } from '@/api/manage'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import { USER_INFO, ACCESS_TOKEN } from '@/store/mutation-types'
import { stdSampleStatusFilter ,stdSampleStatusTbFilters} from '@/utils/filter'
import { Modal } from 'ant-design-vue'

export default {
  name: 'StdSampleInfoBatchList',
  mixins: [JeecgListMixin],
  components: {
    AdvancedSearch: () => import('@/components/tools/AdvancedSearch'),
    FixedMenu: () => import('@/components/tools/FixedMenu'),
  },
  props:{
    isEdit:{
      require:false,
      default:false,
    },
  },
  data() {
    const customRender =  (value,row,index)=> {
          const obj = {
            children: (<span class="text-over">{value}</span>),
            attrs: {class:'text-over',title:value},
          };
          obj.attrs.rowSpan = row.rowSpan
          return obj;
        };
    const columns =  [
      { title: '标准样编号', dataIndex: 'stdNo', width: 180, align: 'left' ,customRender:customRender},
      { title: '物料编号', dataIndex: 'maraMatnr', width: 80, align: 'left',customRender:customRender },
      { title: '物料名称', dataIndex: 'maraMaktx', width: 180, align: 'left' ,customRender:customRender},
      { title: '制定/改版的原因', dataIndex: 'reason', width: 220, align: 'left' ,customRender:customRender ,scopedSlots: { customRender: 'textOver' },},
      { title: '标准样变化说明', dataIndex: 'changeReason', width: 220, align: 'left',customRender:customRender,scopedSlots: { customRender: 'textOver' }, },
      {
          title: '指标',
          dataIndex: 'sampleContent.target',
          width: 50,
          align: 'left',
           scopedSlots: { customRender: 'textOver' },
        },
        {
          title: '指标编码',
          dataIndex: 'sampleContent.targetCode',
          width: 80,
          align: 'left',
           scopedSlots: { customRender: 'textOver' },
        },
        {
          title: '备注',
          dataIndex: 'sampleContent.remark',
          width: 220,
          align: 'left',
           scopedSlots: { customRender: 'textOver' },
        },
      
         {
          title: '评级',
          dataIndex: 'sampleContent.grade',
          width: 90,
          align: 'left',
           scopedSlots: { customRender: 'textOver' },
        },        
        {
          title: '评分',
          dataIndex: 'sampleContent.score',
           width: 50,
          align: 'left',
           scopedSlots: { customRender: 'textOver' },
        },
        {
          title: '缺陷说明',
          dataIndex: 'sampleContent.defectDesc',
           width:200,
          align: 'left',
           scopedSlots: { customRender: 'textOver' },
        }, 
        {
          title: '执行日期',
          dataIndex: 'executeTime',
          width: 100,
          align: 'left',
          scopedSlots: { customRender: 'executeTime' }
          ,customRender:customRender
        },
        { title: '目录分类', dataIndex: 'stdTypeName', width: 120, align: 'left',customRender:customRender },

      {
          title: '状态',
          dataIndex: 'status',
          width: 100,
          align: 'left',
          customRender:  (value,row,index)=> {
            const obj = {
              children:  stdSampleStatusFilter(value),
              attrs: {},
            };
            obj.attrs.rowSpan = row.rowSpan
            return obj;
          },
          // scopedSlots: { customRender: 'filterStatus' },
          filters: stdSampleStatusTbFilters
        },
        { title: '标准样类型', dataIndex: 'stdMoldName', width: 180, align: 'left' ,customRender:customRender},
        { title: '原标准样编号', dataIndex: 'parentStdNo', width: 180, align: 'left' ,customRender:customRender},
        { title: '适用物料编号', dataIndex: 'applyMatnr', width: 180, align: 'left' ,customRender:customRender},
        { title: '适用物料名称', dataIndex: 'applyMaktx', width: 180, align: 'left' ,customRender:customRender},
        { title: '质检实验室', dataIndex: 'lab', width: 120, align: 'left',customRender:customRender },
      
      ]   
    return {
      disableMixinCreated:true,
      userinfo: {
        info: this.$store.getters.userInfo,
        module: 'StdSampleList',
      },
      radioType: '',
      currUser: Vue.ls.get(USER_INFO).username,
      filteredInfo:{},
      
      url: {
        list:'/stdSample/listBatch',// 搜索
        exportXlsUrl: '/stdSample/exportXls', // 导出
        getTree: '/stdSampleType/getTree',
        stdSampleJob: '/stdSample/stdSampleJob',
        updateLabData:'/stdLab/updateLabData',
        deleteBatch:'/stdSampleBase/deleteBatch',
      },
      // 高级查询
      visibleModel: false,
      searchField: 't.std_no',
      queryParam: {
        scopeFlag: true,
        searchField: 't.std_no',
      },
      queryParamCol: [
        { type: 'input', model: 'stdNo', label: '感官标准样编号' },
        { type: 'input', model: 'maraMatnr', label: '物料编号' },
        { type: 'input', model: 'maraMaktx', label: '物料名称' },
        { type: 'input', model: 'lab', label: '质检实验室' },
      ],
      isorter: {
        column: 't.id',
        order: 'desc',
      },
      // 导入
      exportXlsTemplateUrl: 'templates/excel/brandSimilitudeGroupTemplate.xlsx', //导入模板
      excelVisible: false,
      excelConfirmLoading: false,
      columnsExcel: [],
      customParam: { scopeFlag: false , searchField: 't.std_no',contentFlag:true},
      shrinkageFlag: false,
      treeData: [],
      dataList: [],
      treeSelectedKeys: [],
      expandedKeys: [],
      searchValue: '',
      autoExpandParent: true,
      dict: {
        orderList0: [], // 准样内容指标
        dataType: [
          { code: 4, name: '生效中' },
          // { code: 1 , name: '草稿' },
          { code: 2 , name: '审批中' },
          { code: 3 , name: '待执行' },
          { code: 9 , name: '审批不通过' },
          { code: 10 , name: '已作废' },
          { code: 0, name: '我的申请' },
        ], // 数据类型
      
      },
      columns ,
     
    }
  },
  filters: {
    stdSampleStatusFilter,
  },
  watch:{
    customParam:{
      deep:true,
      handler(newName, oldName) {

      
     },
    },
  },
  computed:{
    
  },
  mounted() {
  },
  methods: {
    getQueryField(){},
    loadData(arg) {
            if (!this.url.list) {
                this.$message.error("请设置url.list属性!")
                return
            }
            //加载数据 若传入参数1则加载第一页的内容
            if (arg === 1) {
                this.ipagination.current = 1;
            }
            var params = this.getQueryParams(); //查询条件
            this.loading = true;
            getAction(this.url.list, params).then((res) => {
                if (res.success) {
                    //update-begin---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
                    //this.dataSource = res.result.records || res.result;
                    this.dataSource = []
                    this.dataSource =  this.initMergeData(res.result.records )
                    if (res.result.total) {
                        this.ipagination.total = res.result.total;
                    } else {
                        this.ipagination.total = 0;
                    }
                

                }
                if (res.code === 510) {
                    this.$message.warning(res.message)
                }
                this.loading = false;
            })
        },
        initMergeData(list){
      const set = new Set();

      let resData =JSON.parse( JSON.stringify( list))
       resData.forEach((element,i) => {
        element.rowKey = element.id + '-' + element.sampleContent.id
        if(!set.has(element.id)){
            element.rowSpan  =resData.filter(item=>{return item.id == element.id}).length
            set.add(element.id)
        }else{
          element.rowSpan = 0
        }
          
    }); 

      return resData;

    },
    refresh() {
      this.loadData(1)
    },
    doSearch() {
      this.loadData(1)
    },
    changeKeywordType(value) {
      this.$set(this.queryParam, 'searchField', value)
       this.$set(this.customParam, 'searchField', value)
    },
    /**
     * 高级搜索
     */
    callBackResult() {
      this.visibleModel = false
      this.doSearch()
    },
    closeResulte() {
      this.visibleModel = false
    },
    resetResulte() {
      this.doSearch()
    },
    /**
     * 操作
     */
    handAction(type, id) {
       const that = this
      switch (type) {
        case 'del':
          // 删除，可多选
         
          if (this.selectedRowKeys.length == 0) {
            this.$message.warning('请选择至少一条数据！')
            return
          }
          
          Modal.confirm({
            title: '确认删除',
            content: '请确认是否删除此信息?',
            onOk: function () {
              let ids = that.selectedRowKeys.map(item=>{ return item.split('-')[0]}).join(',')
              deleteAction(that.url.deleteBatch, { ids: ids }).then((res) => {
                if (res.code == 200) {
                  that.$message.success('删除成功')
                  that.loadData(1)
                  that.$emit('loadData')
                } else {
                  that.$message.warning('删除失败:' + res.message)
                }
              })
            },
          })
          break
        case 'link':
          this.gotoDetail(`/stdSample/info?sampleBaseId=${id.id}`)
          break
         case 'his':
          this.gotoDetail(`/stdSample/hisList/${id.stdSampleId}/${id.id}`)
          break  
        case 'add':
          this.gotoDetail(`/stdSample/info`)
          break
        case 'stdType':
          this.gotoDetail(`/stdSample/typeList`)
          break
       
        
        default:
          break
      }
    },
    gotoDetail(url) {
      let routeUrl = this.$router.resolve({
        path: url,
      })
      window.open(routeUrl.href, '_blank')
    },
   
   
   
   

    handleTab(type, code) {
      this.customParam[type] = code
      this.filteredInfo = {}
      this.queryParam.statusIn = '';
      this.loadData(1)
    },
    handleTableChange(pagination, filters, sorter) {
            //分页、排序、筛选变化时触发
            //TODO 筛选
            console.log(pagination)
            // if (Object.keys(sorter).length > 0) {
            //     this.isorter.column = sorter.field;
            //     this.isorter.order = "ascend" == sorter.order ? "asc" : "desc"
            // }
            if (filters.status && filters.status.length > 0) {
              this.queryParam.statusIn = filters.status.join(','); // 状态筛选
            } else {
              this.queryParam.statusIn = '';
            }
            this.filteredInfo = filters;
            this.ipagination = pagination;
            this.loadData(); 
        },
        getCheckboxProps(record){
         return {
          props: {
            disabled: record.rowSpan == 0, // Column configuration not to be checked
          },
        }
        },
  },
}
</script>

<style lang="less" scoped>
@import '~@assets/less/hte-main.less';
@import '~@views/library/hteFile.less';
@import '~@views/library/clearSoln/index.less';
.page-main{
  height: auto;
}
.page-main .container {
  // padding: 25px 125px 100px;
  height: auto;
}
.page-main .banner {
  background-image: url(../../../assets/contract-top.png);
}
.targetRed{
  color: #f50
}
/deep/ .ant-table .ant-table-tbody .ant-table-row td {
  padding: 4px 8px !important;
  line-height:1.3;
}


.text-over{color: #646566;overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 2;      
      /* autoprefixer: off */
      -webkit-box-orient: vertical;
      /* autoprefixer: on */
      overflow-wrap: break-word;
      /* min-height: 50px; */
    }
</style>
